/* pages/user/user.wxss */

page {
  background-color: #F6F6F6; 
}
.top-infor-wrap {
  /* height: 447rpx; */
  height: 432rpx;
  width: 100%;
  overflow: hidden;
}
.top-bg-img {
  /* width: 100%;
  height: 432rpx; */
  width: 100%;
  height: 420rpx;
  position: absolute;
}
.top-infor-wrap {
  position: relative;
}

/* 用户信息（登录） */
.userinfo-wrap {
  margin-top: 22rpx;
  color: #333333;
  height: 100rpx;
  display: flex;
  display: -webkit-flex;
}
.left-infor,
.right-infor {
  display: flex;
  display: -webkit-flex;
  align-items: center;
  -webkit-align-items: center;
}
.left-infor {
  width: 100%;
  max-width: 70%;
}
.right-infor {
  width: 216rpx;
  height: 100%;
}
.avatsr {
  width: 100rpx;
  height: 100rpx;
  border-radius: 50%;
  margin-left: 20rpx;
  border: 3rpx solid #FFFFFF;
}
.infor-wrap {
  /* display: flex;
  display: -webkit-flex; */
  /* flex-direction: column; */
  /* -webkit-flex-direction: column; */
  /* justify-content: space-between; */
  /* -webkit-justify-content: space-between; */
  margin-left: 24rpx;
  height: 100rpx;
  max-width: 70%;
}
.infor-wrap .user-name {
  margin-top: 2rpx;
  font-size: 36rpx;
  font-weight: bold;
  height: 50rpx;
  line-height: 50rpx;
  word-wrap: break-word;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;

}
.infor-wrap .menbers {
  /* width: 150rpx; */
  height: 38rpx;
  border-radius: 20rpx;
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  padding-right: 16rpx;
  display: inline-block;
  margin-top: 8rpx;
}

.infor-wrap .vip-img {
  background: #fea54e url('/static/images/icon/vip-bg-2.png') no-repeat;
  background-size: 150rpx 100%;
}
.infor-wrap .menbers-img {
  background: #92a7c7 url('/static/images/icon/vip-bg-1.png') no-repeat;
  background-size: 150rpx 100%;
}

.infor-wrap .menbers .default-img,
.infor-wrap .menbers .vip-txt {
  /* position: absolute; */
  display: block;
  top: 0;
}
.infor-wrap .menbers .default-img {
  width: 150rpx;
  height: 36rpx;
}
.infor-wrap .menbers .vip-txt {
  width: 100%;
  color: #fff;
  font-size: 24rpx;
  /* left: 43rpx; */
  margin-left: 43rpx;
  line-height: 36rpx;
}
.infor-wrap .pay-vip-wrap .priming-vip-txt {
  color: transparent;
  background-color: #FFA148;

  height: 36rpx;
  border-radius: 20rpx;
  font-size: 24rpx;
  margin-left: 43rpx;
}

.right-infor .scan-code,
.right-infor .sign-in,
.right-infor .message {
  width: 48rpx;
  height: 48rpx;
  margin-right: 24rpx;
}
.right-infor .message > image {
  width: 48rpx;
  height: 48rpx;
}

/* 钱包数据 */
.wallet-wrap {
  height: 300rpx;

  width: 100%;
  padding: 0 20rpx;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  -webkit-flex-direction: column;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.wallet-wrap .cloumn-wrap,
.wallet-wrap .vip-column {
  width: 710rpx;
}
.wallet-wrap .vip-column {
  font-size: 24rpx;
  color: #D0C8B6;
  height: 140rpx;
  position: relative;
}
.wallet-wrap .vip-column image {
  width: 100%;
  height: 140rpx;
}
.wallet-wrap .cloumn-wrap {
  padding-top: 4rpx;
  height: 162rpx;
  box-sizing: border-box;
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
  align-items: center;
  -webkit-align-items: center;
}
.wallet-wrap .cloumn-item {
  width: 100%;
  text-align: center;
}
.wallet-wrap .numbers-txt {
  color: #333;
  font-size: 36rpx;
  font-weight: Bold;
  height: 50rpx;
  line-height: 50rpx;
}
.wallet-wrap .infor-txt {
  font-size: 24rpx;
  color: #5B5B5B;
}
.txt-seat{
  width: 68%;
  height: 24rpx;
  line-height: 28rpx;
  position: absolute;
  bottom: 36rpx;
  left: 30rpx;
}
.bth-seat {
  font-size: 24rpx;
  position: absolute;
  font-weight: bold;
  bottom: 40rpx;
  right: 30rpx;
  text-align: center;
  color: #333333;
  width: 156rpx;
  height: 58rpx;
  line-height: 58rpx;
  border-radius: 60rpx;
  background-image: linear-gradient(to left, #F1CF97, #FDECBE);
}

/* 我的订单 */
.my-order-wrap {
  width: 710rpx;
  height: 215rpx;
  background-color: #FFFFFF;
  border-radius: 12rpx;
  margin: 20rpx 20rpx 20rpx 20rpx;
  overflow: hidden;
  font-size: 24rpx;
  color: #5B5B5B;
}
.my-order-wrap .top-title{
  /* 标记 */
  width: 100%;
  height: 69rpx;
  line-height: 90rpx;

  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.my-order-wrap .top-title image {
  width: 24rpx;
  height: 24rpx;
  display: inline-block;
}
.my-order-wrap .title-left {
  color: #333333;
  font-size: 28rpx;
  font-weight: bold;
  margin-left: 30rpx;
}
.my-order-wrap .title-right {
  color: #666666;
  margin-right: 23rpx;
  /* height: 100%; */
  height: 100rpx;
  display: flex;
  display: -webkit-flex;
  align-items: center;
  -webkit-align-items: center;
}
.my-order-wrap .cloumn-wrap{
  width: 660rpx;
  margin-left: 25rpx;
  height: 149rpx;
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
  -webkit-align-items: center;
}
.my-order-wrap .cloumn-item {
  /* background-color: red; */
  height: 94rpx;
  width: 20%;
  text-align: center;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  -webkit-flex-direction: column;
  justify-content: flex-start;
  -webkit-justify-content: flex-start;
  align-items: center;
  -webkit-align-items: center;
}
.my-order-wrap .cloumn-item .item-img {
  margin-bottom: 8rpx;
} 
.my-order-wrap .item-img {
  width: 48rpx;
  height: 48rpx;
}
.my-order-wrap .infor-txt {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 分销中心 & 积分商店 */
.distribution-points-wrap {
  width: 710rpx;
  height: 126rpx;
  background-color: #FFFFFF;
  border-radius: 12rpx;
  margin: 0 20rpx;
  font-size: 24rpx;
  color: #333333;
  overflow: hidden;
  position: relative;
  display: flex;
  display: -webkit-flex;
  justify-content: space-around;
  -webkit-justify-content: space-around;
  align-items: center;
  -webkit-align-items: center;
}
.distribution-points-wrap .points-item,
.distribution-points-wrap .distribution-item {
  width: 355rpx;
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.distribution-points-wrap .txt-left {
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  -webkit-flex-direction: column;
}
.distribution-points-wrap .points-item .txt-left,
.distribution-points-wrap .distribution-item .txt-left {
  height: 76rpx;
  margin-left: 30rpx;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.distribution-points-wrap .points-item .img-right,
.distribution-points-wrap .distribution-item .img-right {
  margin-right: 30rpx;
}
.distribution-points-wrap .points-item text,
.distribution-points-wrap .distribution-item text {
  width: 217rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.distribution-points-wrap .txt-left text:first-child {
  font-weight: bold;
  font-size: 28rpx;
}
.distribution-points-wrap .txt-left text:last-child {
    color: #999999;
    font-size: 24rpx;
}
.distribution-points-wrap .img-right {
  width: 80rpx;
  height: 80rpx;
}
.distribution-points-wrap::after {
  content: '';
  display: inline-block;
  width: 2rpx;
  height: 60rpx;
  background-color: #E1E1E1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  clear: left;
}

/* 服务与工具 */
.tools-wrap {
  width: 710rpx;
  height: 329rpx;
  background-color: #FFFFFF;

  border-radius: 12rpx;
  margin: 20rpx 20rpx 0rpx 20rpx;
  font-size: 24rpx;
  color: #5B5B5B;
  overflow: hidden;
}
.tools-wrap .title-txt {
  height: 69rpx;
  line-height: 90rpx;
  padding-left: 30rpx;
  color: #333333;
  font-size: 28rpx;
  font-weight: bold;
}
.tools-wrap .cloumn-wrap {
  width: 704rpx;
  margin-left: 3rpx;

  height: 260rpx;
  display: flex;
  display: -webkit-flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  align-content: space-evenly;
  -webkit-align-content: space-evenly;
}
.tools-wrap .cloumn-item {
  height: 94rpx;
  width: 25%;
  text-align: center;
  display: flex;
  display: -webkit-flex;
  flex-flow: column nowrap;
  -webkit-flex-flow: column nowrap;
  justify-content: flex-start;
  -webkit-justify-content: flex-start;
  align-items: center;
  -webkit-align-items: center;
}
.tools-wrap .cloumn-item .item-img {
  margin-bottom: 8rpx;
} 

.tools-wrap .item-img {
  width: 48rpx;
  height: 48rpx;
}
.tools-wrap .infor-txt {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 为您推荐 */
.recommend {
  width: 100%;
  text-align: center;
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
  -webkit-align-items: center;
  color: #333;
  font-size: 28rpx;
  height: 39rpx;
  margin: 24rpx 0 20rpx 0;
}
.recommend .title-txt {
  display: block;
}
.recommend .before-img {
  width: 21rpx;
  height: 18rpx;
  margin-right: 8rpx;
}
.recommend .after-img {
  width: 16rpx;
  height: 14rpx;
  margin-left: 8rpx;
}
/* 消息提示小红点 */
.quantity-tip-dots {
  padding: 1rpx;
  display: inline-block;
  min-width: 28rpx;
  height: 28rpx;
  line-height: 28rpx;
  font-size: 22rpx;
  background-color: #F52C32;
  border-radius: 50rpx;
  text-align: center;
  color: #fff;
  border: 1rpx solid #fff;
  position: absolute;
}
.right-infor > .message,
.my-order-wrap .cloumn-wrap > .cloumn-item {
  position: relative;
}
.my-order-wrap .quantity-tip-dots {
  top: -10rpx;
  left: 80rpx;
}
.right-infor > .message > .quantity-tip-dots {
  top: -10rpx;
  right: -10rpx;
}
/* 未登录 */
.default-userinfor-wrap .sign-in-txt {
  margin-left: 24rpx;
  font-weight: bold;
}
.default-userinfor-wrap .left-infor {
  margin-top: 32rpx;
}
/* 推荐内容 */
.recommend-products {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  justify-content: flex-start;
  -webkit-justify-content: flex-start;
}
.recommend-products .column-item {
  font-size: 28rpx;
  color: #333;
  padding: 20rpx;
  margin-top: 20rpx;
  margin-left: 20rpx;
  background-color: #fff;
  box-sizing: border-box;
  width: 344rpx;
  height: 496rpx;
  border-radius: 10rpx;
  position: relative;
}
.recommend-products .column-item:nth-child(1),
.recommend-products .column-item:nth-child(2) {
  margin-top: 0;
}
.recommend-products .pro-img {
  width: 304rpx;
  height: 304rpx;
}
.recommend-products .pro-title {
  height: 38rpx;
  line-height: 38rpx;
  display: flex;
  display: -webkit-flex;
  margin-top: 20rpx;
}
.recommend-products .pro-title .pro-activity-tag {
  font-size: 24rpx;
  color: #fff;
  background-color: #F81A1A;
  padding: 2rpx 10rpx;
  border-radius: 10rpx;
  display: inline-block;
  margin-right: 4rpx;
  white-space: nowrap;
}
.recommend-products .pro-title .pro-title-name {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
}
.recommend-products .pro-tag {
  color: #888888;
  font-size: 24rpx;
  margin-top: 10rpx;
  width: 304rpx;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
}
.recommend-products .pro-price {
  color: #F81A1A;
  position: absolute;
  left: 20rpx;
  bottom: 20rpx;
}
.recommend-products .pro-price text:nth-child(2) {
  font-size: 32rpx;
}
/* 推荐商品 触底 */
.tips {
  margin-top: 25px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #999;
  font-size: 12px;
  width: 100%;
}

/* 顶部自定义头部导航栏 */
view >>> .bar-line .bar-title {
  font-size: 36rpx;
}